
<%--
  Created by IntelliJ IDEA.
  User: 羽
  Date: 2015/10/28
  Time: 13:31
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" pageEncoding="utf-8" %>

<html>

<script type="text/javascript" src="<%=request.getContextPath()%>/resources/js/public/mapObj.js"></script>
<head>
    <title>道路停车场管理</title>
</head>


<body style="overflow: hidden;">
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span>
    场库管理 <span class="c-gray en">&gt;</span>
    停车信息列表
</nav>
<div class="container">
    <div id="right" style='float:right;width:80%;height:99%;border-left:2px ridge;overflow: hidden'>

        <div class="righthead">
            <div style="height:9px"></div>
            <div id="showBtn" class="hideLeft"></div>
            <div class="hideLeftT">
                <div id="refresh" class="hideLeftTwo"></div>
                <div id="text" class="refreshtext"><span>刷新</span></div>
            </div>
        </div>
        <div id="mapObj" style="width:99%;height:99%">
        </div>

    </div>
    <div id="left" style='width:20%;height:99%;'>
        <div id="param" class="lefthead ">
            &nbsp;
            <input type="text" placeholder=" 停车场名称" style="width:150px;height:27px;padding-left:5px;margin-top: 5px"
                   class="input-text" id="name">&nbsp;

            <input class="btn btn-primary size-S radius" type="button" style="margin-top: 5px" id="doSearch"
                   value="搜索">

            <div style="margin-left: 10px;margin-top: 4px;">
                <input type="radio" name="radio" value="parkname"
                       id="parkname" checked="checked">
                <label for="parkname">名称</label>

                <input type="radio" name="radio" value="parkno" id="parkno">
                <label for="parkno">编号</label>

                &nbsp;
                <label for="totalparknum">车位数>=</label>
                <input type="text" name="number" id="totalparknum" style="width: 30px;height: 20px" value="0">
            </div>
        </div>
        <div id="result" class="parkinfos"></div>
        <div id="resulttotal" style="font-size: 12px;color: #999;height: 42px;line-height: 42px;">系统为您找到相关结果${total}个
        </div>
        <div id="pagination" class="pagination" style="text-align:center;margin-top:5px"><!-- 这里显示分页 --></div>
    </div>
</div>
</body>
</html>
<%@include file="../../head-ui.jsp" %>
<script type="text/javascript">
    var mapObj = null;
    var arrroadtitle = [];
    var arrlinkmap = [];
    var index;

    $(function () {
        var total = parseInt('${total}');
        mapObj = new MapEditor("mapObj", null)
        initPagination(total);
        $("#doSearch").click(function () {
            if (pattern($('#totalparknum').val())) {
                $.ajax({
                    url: '<%=request.getContextPath()%>/back/roadpark/getCount.do',
                    type: 'POST',
                    data: "parkname=" + ($("#name").val() || "") +
                    "&columnname=" + pd()["radio"] + "&numcondition=" + pd()["totalparknum"] || "",
                    success: function (count) {
                        $("#resulttotal").empty().append("系统为您找到相关结果" + count + "个")
                        initPagination(count);
                    }
                })
            } else {
                searchErrorDialog();
            }

        })
        $('#text').click(function () {

            if (pattern($('#totalparknum').val())) {
                mapObj.removeAll();
                pageselectCallback(index);
            } else {
                RefresErrorDialog();
            }
        });

        $("#showBtn").click(function () {
            var btn = $("#showBtn");
            var right = $("#right");
            $("#left").toggle();

            if (btn.hasClass("hideLeft")) {

                btn.removeClass("hideLeft").addClass("showLeft");

                right.width($(".container").width());

                right.addClass("fullScreen");

            } else {

                btn.removeClass("showLeft").addClass("hideLeft");

                right.width($(".container").width() * 0.8);

                right.removeClass("fullScreen");
            }


        })
    });
    var initPagination = function (num) {

        $("#pagination").pagination(num, {
            callback: pageselectCallback
        });
    };


    function pageselectCallback(page_index, jq) {
        var arr = [];
        index = page_index;
        $("#result").empty().append("正在加载数据,请稍等.....");
        $(".next").hide();
        $(".prev").hide();
        $.ajax({
            url: '<%=request.getContextPath()%>/back/roadpark/list.do',
            type: 'POST',
            data: "curPage=" + (page_index + 1) + "&pageSize=10&parkname=" + ($("#name").val() || "") +
            "&columnname=" + pd()["radio"] + "&numcondition=" + pd()["totalparknum"] || "",
            success: function (json) {
                var html = "";
                for (var i = 0; i < json.data.length; i++) {
                    var obj = json.data[i];
                    if (i == json.data.length) {
                        var str = "&nbsp;&nbsp;<li id='" + obj.id + "'style='list-style-type: none; margin-left:3px;margin-top:-17px;  cursor: pointer; ' " +
                                "onmouseover=\"onmouseover_Style(" + obj.id + ")\" onmouseout=\"onmouseout_Style(" + obj.id + ")\"" +
                                "onclick='linkMap(" + obj.id + ")'>" + (i + 1) + "." + obj.parkname + "<a onclick=\"editRoadPark('" + obj.id + "')\" class='xq'>详情>>" + "</a>" + "</li>";
                    } else {
                        var str = "&nbsp;&nbsp;<li id='" + obj.id + "' style='list-style-type: none;margin-left:3px;margin-top:-17px;" +
                                "border-bottom-width: 1px; border-bottom-style: dashed; border-bottom-color: rgb(219, 219, 219); cursor: pointer; ' " +
                                "onmouseover=\"onmouseover_Style(" + obj.id + ")\" onmouseout=\"onmouseout_Style(" + obj.id + ")\" " +
                                "onclick='roadlinkMap(" + obj.id + ")'>" + (i + 1) + "、" + obj.parkname + "<a onclick=\"editRoadPark('" + obj.id + "')\" class='xq'>详情>>" + "</a>" + "</li>";
                    }
                    html += str;

                    arr.push(mapObj.addMarker(linkmapcontent(obj)));
                    arrlinkmap = arr;
                }


                //   mapObj.map.setViewport(arr);

                $("#result").empty().append(html);
            }

        })
        if (arr.length != null) {
            mapObj.removeAll();
            arr = [];
            arrroadtitle = [];
        }
        return false;
    }

    function linkmapcontent(obj) {
        obj.label = obj.totalnum;
        var fee = obj.fee || "---";
        var title = "<strong class='titlefont'>" + obj.parkname + "</strong>" + "<hr> </>" // 信息窗口标

        obj.imagename = "park";//标识
        obj.content = "<div  class='titlefont'><strong>开放时间：</strong>" + obj.opentime +
                "<div><strong>区域</strong>：" + obj.district + "</div>" +
                "<div><strong>地址</strong>：" + obj.parkname + "</div>" +
                "<div><strong>停车费用</strong>：" + fee + "</div>" +
                "<div><strong>详情</strong>：<a onclick=\"editRoadPark('" +
                obj.id + "')\" href='#' class='xq'>点击查看</a></div>" +
                "</div>";  // 创建信息窗口对象
        obj.title = mapObj.getwindow(320,200, title);//设置标题栏
        arrroadtitle.push(obj.title);//

            return obj;
    }
    function editRoadPark(id) {
        var index = layer.open({
            type: 2,
            title: '道路停车场编辑',
            content: "<%=request.getContextPath()%>/back/roadpark/edit.do?id=" + id
        });
        layer.full(index);

    }
    function roadlinkMap(id) {
        $("#result li").css("background", "");
        $("#" + id).css("background", "#EEEEEE");
        var roadwindowcontent = new Object();
        var centen = null;
        var titlecontent = null;
        for (var i = 0; i < arrlinkmap.length; i++) {
            if (arrlinkmap[i].id == id) {
                centen = arrlinkmap[i];
                titlecontent = arrroadtitle[i];
            }
        }
        roadwindowcontent.fee = centen.fee || "---";
        roadwindowcontent.point = new BMap.Point(centen.lng, centen.lat);
        roadwindowcontent.titlecontent = titlecontent;
        roadwindowcontent.content = "<div  class='titlefont'><strong>开放时间</strong>：" + centen.opentime +
                "<div><strong>区域</strong>：" + centen.district + "</div>" +
                "<div><strong>地址</strong>：" + centen.parkname + "</div>" +
                "<div><strong>停车费用</strong>：" + roadwindowcontent.fee + "</div>" +
                "<div><strong>详情</strong>：<a onclick=\"editRoadPark('" +
                centen.id + "')\" href='#' class='xq'>点击查看</a></div>" +
                "</div>";  // 创建信息窗口对象
        mapObj.linkMap(roadwindowcontent, centen.marker);
    }

    function pd() {
        var xzcondition = new Object();
//        if ($('#totalnum').is(':checked')) {
//            xzcondition["checkbox"] = $("#totalnum").val();
//        } else {
//            xzcondition["checkbox"] = "";
//        }
        xzcondition["totalparknum"] = $('#totalparknum').val();
        if ($('#parkname').is(':checked')) {
            xzcondition["radio"] = $("#parkname").val();
        } else if ($('#parkno').is(':checked')) {
            xzcondition["radio"] = $("#parkno").val()
        }


        return xzcondition;

    }

</script>
